<template>
  <view class="head">
    <view class="head_logo">
      <image src="/static/images/index/logo@2x.png" alt="" srcset="" mode="widthFix"></image>
    </view>
    <view class="head_title">运一综合管理培训系统</view>
    <view class="head_setting">
      <view class="head_setting_my" style="cursor: pointer;" @click="goToMy">
        <image src="/static/images/index/btn_my@2x.png" alt="" mode="widthFix"></image>
      </view>
      <view class="head_setting_set" style="cursor: pointer;" @click="goToSet">
        <image src="/static/images/index/btn_system@2x.png" alt="" mode="widthFix"></image>
      </view>
    </view>
  </view>
</template>

<script>
import { getToken } from '@/utils/auth'

export default {
  name: 'PageHeader',
  methods: {
    goToMy() {
      // const token = getToken()
      // if (token) {
      // 已登录
      // console.log('登录了:', token);
      uni.navigateTo({
        url: '/pages/mine/index'
      })
      // } else {
      // 未登录
      // console.log('没Token:', token);
      // uni.navigateTo({
      //   url: '/pages/login'
      // })
      // }

    },
    goToSet() {
      // uni.navigateTo({
      //   url: '/pages/set/index'
      // })
    },


  },
}
</script>

<style lang="scss" scoped>
.head {
  width: 100vw;
  height: calc(100vw * 140 / 2560); // 高度按比例自适应
  // min-height: 70px; // 可选，防止太小
  // max-height: 200px; // 可选，防止太大
  background: url('@/static/images/index/bg_top@2x.png') no-repeat center center;
  background-size: cover;

  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 calc(100vw * 60 / 2560);

  .head_logo {
    width: calc(100vw * 200 / 2560);
    height: 100%;
    display: flex;
    align-items: center;

    image {
      width: 100%;
    }
  }

  .head_title {
    height: calc(100vw * 77 / 2560);
    color: #fff;
    font-size: calc(100vw * 56 / 2560);
    text-align: center;
    margin-bottom: calc(100vw * 30 / 2560);
  }

  .head_setting {
    height: calc(100vw * 80 / 2560);
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;

    .head_setting_my {
      margin-right: calc(100vw * 30 / 2560);
    }

    .head_setting_my,
    .head_setting_set {
      width: calc(100vw * 64 / 2560);
      height: calc(100vw * 64 / 2560);

      image {
        width: 100%;
        height: 100%;
      }

      ;
    }
  }
}
</style>